<template>
  <div>
    <!-- 头部导航 -->
    <Logo title="欢迎加入" />
    <!-- 注册主题 -->
    <div class="card_box">
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <div class="title_router">
            <div >
              <router-link to="/newPronen">我是新人</router-link>
            </div>
            <div>|</div>
            <div>
              <router-link to="/company">我是公司</router-link>
            </div>
          </div>
        </div>
        <el-form ref="form" :model="form" label-width="80px">
          <el-form-item label="公司名称 ">
            <el-input v-model="form.gongsi" placeholder="请输入您的公司名称"></el-input>
          </el-form-item>
          <el-form-item label="您的姓名 ">
            <el-input v-model="form.username" placeholder="请输入您的姓名"></el-input>
          </el-form-item>
          <el-form-item label="密码*">
            <el-input v-model="form.password" placeholder="请输入密码"></el-input>
          </el-form-item>
          <el-form-item label="手机号*">
            <el-input v-model="form.phone" placeholder="请输入您的手机号"></el-input>
          </el-form-item>
          <el-form-item label="邮箱*">
            <el-input v-model="form.email" placeholder="请输入您的常用邮箱"></el-input>
          </el-form-item>
          <el-form-item>
            <el-checkbox label="《XXXX平台用户协议》" name="type"></el-checkbox>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm">立即注册</el-button>
          </el-form-item>
        </el-form>
        <div class="goLogin"> 
            已有账号？<router-link to="/login">立即登录</router-link>
        </div>
       
      </el-card>
    </div>
    <!-- /尾部导航 -->
    <Foot />
  </div>
</template>

<script>
import Logo from "../../Login/logo";
import Foot from "../../componnet/qiantai/Foot";
import api from '../../api'
export default {
  name: "Company",
  data() {
    return {
      form: {}
    };
  },

  methods: {
    submitForm() {
      // 注册公司的事件
      api.getloginodd({
        username: this.form.username,
          password: this.form.password,
          phone: this.form.phone,
          email: this.form.email,
          gongsi: this.form.gongsi
      }).then(res=>{
         if ( this.form.username&&this.form.password &&this.form.phone&&this.form.email&&this.form.gongsi) {
            if (res.data.status == 200) {
              this.$confirm("您以成功注册是否取登录", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              })
                .then(() => {
                  this.$router.replace("/login");
                })
                .catch(() => {
                  this.$message({
                    type: "success",
                    message: "注册成功"
                  });
                });
            } else {
              this.$message({
                type: "error",
                message: "此手机或邮箱已被注册"
              });
            }
          }else{
             this.$message({
                type: "error",
                message: "请正确的填写信息或不能为空"
              });
          }
      })
    }
  },
  components: {
    Logo,
    Foot
  }
};
</script>

<style lang="less" scoped>
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.box-card {
  width: 480px;
  margin: auto;
  margin-top: 100px;
}
.title_router{
  display: flex;
  div{
    margin: auto;
  }
  a{
    padding: 20px;
    font-size: 20px;
    color: #000000;
    font-weight: 600;
  }
} 
.goLogin{
  text-align: center;
}
</style>